﻿@page
@{ Layout = "_Layout"; }

<el-table :data="specials" v-on:row-dblclick="btnEditClick">
  <el-table-column label="专题名称">
    <template slot-scope="scope">
      <el-link
        :underline="false"
        :href="siteUrl + scope.row.url"
        target="_blank"
        type="primary">
        {{ scope.row.title }}
      </el-link>
    </template>
  </el-table-column>
  <el-table-column label="访问地址" prop="url"></el-table-column>
  <el-table-column label="添加时间" prop="addDate"></el-table-column>
  <el-table-column label="操作" width="330">
    <template slot-scope="scope">
      <el-link
        :underline="false"
        type="primary"
        v-on:click="btnUploadClick(scope.row)">
        上传文件
      </el-link>
      <el-link
        :underline="false"
        type="primary"
        v-on:click="btnDownloadClick(scope.row)">
        下载压缩包
      </el-link>
      <el-link
        :underline="false"
        type="primary"
        v-on:click="btnEditClick(scope.row)">
        设置
      </el-link>
      <el-link
        :underline="false"
        type="primary"
        v-on:click="btnCreateClick(scope.row)">
        生成页面
      </el-link>
      <el-link
        :underline="false"
        v-if="scope.row.id > 0"
        type="danger"
        v-on:click="btnDeleteClick(scope.row)">
        删除
      </el-link>
    </template>
  </el-table-column>
</el-table>

<div style="height: 10px"></div>
<el-divider></el-divider>
<div style="height: 10px"></div>

<el-button
  size="small"
  type="primary"
  v-on:click="btnAddClick">
  新建专题
</el-button>

<el-drawer
  id="form"
  v-if="form"
  :title="form.id > 0 ? (form.isUploadOnly ? '上传文件' : '设置') : '新建专题'"
  :visible.sync="panel"
  destroy-on-close
  direction="rtl"
  size="50%">
  <div class="drawer__content">
    <el-form v-on:submit.native.prevent size="small" ref="form" :model="form" label-width="150px">
      <el-form-item v-if="!form.isUploadOnly" label="专题名称" prop="title" :rules="{
        required: true, message: '请输入专题名称'
      }">
        <el-input v-model="form.title" placeholder="请输入专题名称"></el-input>
      </el-form-item>
      <el-form-item v-if="!form.isUploadOnly" label="访问地址" prop="url" :rules="{
        required: true, message: '请输入访问地址'
      }">
        <el-input v-model="form.url" placeholder="请输入访问地址"></el-input>
      </el-form-item>
      <el-form-item v-if="!form.isEditOnly" label="专题文件">
        <el-upload
          :drag="true"
          :action="uploadUrl"
          :auto-upload="true"
          :headers="{Authorization: 'Bearer ' + $token}"
          :file-list="uploadList"
          :before-upload="uploadBefore"
          :on-progress="uploadProgress"
          :on-success="uploadSuccess"
          :on-error="uploadError"
          :on-remove="uploadRemove"
          :multiple="true">
          <i class="el-icon-upload"></i>
          <div class="el-upload__text">请将专题包含的文件或者专题压缩包拖到此处，或 <em>点击上传</em></div>
        </el-upload>
      </el-form-item>

      <el-divider></el-divider>
      <div class="drawer__footer">
        <el-button type="primary" v-on:click="btnSubmitClick" size="small">确 定</el-button>
        <el-button size="small" v-on:click="btnCancelClick">取 消</el-button>
      </div>
    </el-form>
  </div>
</el-drawer>

@section Scripts{
<script src="/sitefiles/assets/js/admin/cms/templatesSpecial.js" type="text/javascript"></script> }